/**
  * Menu Theme: ios7 style
  * Theme ID: oc1
  * Author: hzp (hzp@yunshipei.com)
  */
@am-offcanvas-mask-color: rgba(0, 0, 0, .4);
@am-offcanvas-body-color: lighten(@gray-light, 4.5%); //#eeeeee
.am-offcanvas {
  background: @am-offcanvas-mask-color;
  .am-offcanvas-bar-show {
    background: @am-offcanvas-body-color;
    &::after {
      box-shadow: none;
      background: none;
    }
  }
}

.am-menu-clear {
  @nav-ios7-padding-vertical: 10px;
  @nav-ios7-padding-horizontal: 15px;
  @nav-ios7-lv1-a-heihgt: 49px;
  @nav-ios7-lv2-a-heihgt: 44px;

  @nav-ios7-bg-color: @white;
  @nav-ios7-color: @gray-darker;
  @nav-ios7-hover-bg-color: @global-bg-ligter-color;
  @nav-ios7-hover-color: @gray-darker;
  @nav-ios7-active-bg-color: @global-bg-ligter-color; //#eeeeee
  @nav-ios7-active-color: @global-primary;

  @nav-ios7-divider-border: @global-mask-bg-color;
  @nav-ios7-nested-color: #EEE;
  @nav-ios7-nested-hover-color: #FFF;

  @nav-ios7-border-color: @global-border;

  @nav-ios7-icon-color: @global-icon-color; // #c2c2c2
  @nav-ios7-icon-active-color: @global-primary;

  @nav-ios7-sub-a-color: @gray;
  @nav-ios7-sub-bg-color: @global-bg-ligter-color;
  @nav-ios7-sub-a-active-color: @global-primary;

  border-bottom: 1px solid @nav-ios7-border-color;
  background: @nav-ios7-bg-color;

  .am-menu-sub {
    border-top: 1px solid @nav-ios7-border-color;
    padding: 0;
    background-color: lighten(@nav-ios7-active-bg-color, 5%);
    color: @nav-ios7-active-color;
    font-size: 1.4rem;
    display: none !important;
  }

  .am-open .am-menu-sub {
    display: block !important;
    height: auto !important;
  }

  a {
    &::after {
      .am-icon-font;
    }
  }

  & > li {
    &.am-parent {
      > a {
        .transition(all 0.3s);
        &::after {
          content: @fa-var-chevron-left;
          position: absolute;
          right: 1.5rem;
          top: 1.3rem;
          color: @nav-ios7-icon-color;
          .transition(all .1s linear);
        }
      }
      &.am-open {
        > a {
          &::after {
            .rotate(-90deg);
            .transition(all .1s linear);
            color: @nav-ios7-icon-active-color;
          }
        }
      }
    }
    > a {
      position: relative;
      color: @nav-ios7-color;
      border-top: 1px solid @nav-ios7-border-color;
      padding: 0;
      height: @nav-ios7-lv1-a-heihgt;
      line-height: @nav-ios7-lv1-a-heihgt;
      text-indent: 10px;

    }
  }

  .am-menu-lv2{
    & > li{
      & > a{

        height: @nav-ios7-lv2-a-heihgt;
        line-height: @nav-ios7-lv2-a-heihgt;
        text-indent: 15px;
        padding: 0;

      }

    }
  }

  & > .am-open > a,
  & > li > a:hover,
  & > li > a:focus {
    background-color: @nav-ios7-hover-bg-color;
    color: @nav-ios7-active-color;
    outline: none;
  }

  /*
  * Active
  */
  & > li.am-active > a {
    background: @nav-ios7-active-bg-color;
    color: @nav-ios7-active-color;
  }

  /*
  * Sub-object: `am-nav-divider`
  */
  .am-nav-divider {
    border-top: 1px solid @nav-ios7-divider-border;
  }

  /*
  * Nested items
  */
  & ul {
    background: @nav-ios7-sub-bg-color;
    a {
      color: @nav-ios7-sub-a-color;
      padding-left: 15px;
      &:hover {
        background: @nav-ios7-active-bg-color;
      }
    }
  }
  & ul a:active {
    color: @nav-ios7-sub-a-active-color;
  }

  .hook-am-menu-clear;
}

.hook-am-menu-clear() {
}